/******************************
常用动画效果集合
******************************/
@include keyframes(moveIn){
  to{
    @include opacity(0);
    @include transform(translateX(0));
  }
}
@include keyframes(WobbleInX){
   0% {
     @include transform(perspective(250px) rotateX(90deg));
     @include opacity(0);
   }
   100% {
     @include transform(perspective(250px) rotateX(0deg));
     @include opacity(0.9);
   }
}
%mdui-hoverable{
  @include transition(box-shadow .25s cubic-bezier(.4,0,.2,1));
  will-change: box-shadow;
  &:focus,&:hover {
    box-shadow: 0 5px 5px -3px rgba(0,0,0,.2),0 8px 10px 1px rgba(0,0,0,.14),0 3px 14px 2px rgba(0,0,0,.12)
  }
}
@include keyframes(rotate){
  50% {
    @include transform(rotate(180deg));
  }
  100% {
    @include transform(rotate(0deg));
  }
}